<template>
  <!-- 题库 -->
  <div class="app-container">
    <div class="screening">
      快速筛选
      <el-button
        @click="getBaodian(1)"
        :class="{ current: paging.type == 1 ? true : '' }"
        >专家宝典</el-button
      >
      <el-button
        :class="{ current: paging.type == 2 ? true : '' }"
        @click="getBaodian(2)"
        >商务宝典</el-button
      >
    </div>
    <div class="WangEditor">
      <WangEditor ref="WangEditor" :key="random" :list="writeData"></WangEditor>
    </div>
    <el-button
      v-if="writeData.length"
      v-hasPermi="['doc:richText:edit']"
      type="primary"
      @click="saveFn"
      >保存</el-button
    >
    <el-button v-else @click="addFn" v-hasPermi="['doc:richText:add']">
      新增
    </el-button>
  </div>
</template>

<script>
import ComForm from "../../../components/comForm.vue";
import ComSelect from "../../../components/comSelect.vue";
import ComTable from "../../../components/comTable.vue";
import comForm from "../../../components/comForm.vue";

import WangEditor from "../../../components/wangEditor.vue";
import {
  getRichTextListApi,
  getRichTextEditApi,
  getRichTextAddApi,
} from "@/wss/api/HumanResources/EM/Baodian.js";
export default {
  name: "laws",
  dicts: ["sys_normal_disable"],
  components: {
    ComSelect,
    ComForm,
    comForm,
    ComTable,

    WangEditor,
  },

  data() {
    return {
      paging: {
        pageNum: 1,
        pageSize: 10,
        type: 1,
      },
      // 判断是商务还是专家 默认是专家
      type: 1,
      params: {
        id: "",
        type: "",
        title: "",
        content: "",
        status: 0,
      },
      // 修改id
      editId: "",
      dialogVisible: false,
      initSelectValue: "",
      writeData: [],
      // 切换筛选状态，不更新bug修复
      random: "",
      // 当前筛选的状态
      currentSelect: "",
    };
  },

  mounted() {
    this.getRichTextListFn();
  },
  methods: {
    // 新增
    async addFn() {
      this.$refs.WangEditor.getEditorDataFn();
      let content = this.$refs.WangEditor.getEditorDataFn();
      console.log(this.params);
      this.params.content = content;
      this.params.type = this.type;

      const { msg, code } = await getRichTextAddApi(this.params);
      if (code == 200) {
        this.$message({
          type: "success",
          message: msg,
        });
        content = null;
      }
    },
    // 保存
    async saveFn() {
      let content = this.$refs.WangEditor.getEditorDataFn();
      this.params.content = content;
      this.params.id = this.params.idStr;

      // debugger
      const { msg, code } = await getRichTextEditApi(this.params);
      if (code == 200) {
        this.$message({
          type: "success",
          message: msg,
        });
        content = null;
      }
    },
    // 获取宝典
    getBaodian(type) {
      this.paging.type = type;
      this.type = type;
      this.getRichTextListFn();
    },

    async getRichTextListFn() {
      setTimeout(async () => {
        let { data, code } = await getRichTextListApi(this.paging);
        if (code === 200) {
          console.log(data, "宝典");

          this.writeData = JSON.parse(JSON.stringify(data.rows));

          this.params = this.writeData[0];
          // 防止是undefined
          if (!this.params) {
            this.params = {
              id: "",
              type: "",
              title: "",
              content: "",
              status: 0,
            };
          }
        }
      }, 100);
    },

    async ChangeFn(value) {
      this.$refs.comForm.resetFn();
      // 更新是状态（如代编辑）
      this.currentSelect = value;

      this.options.value = value;
      this.paging.postionType = value;
      this.getExamSubjectListFn(this.paging);
    },

    // 查看
  },
};
</script>

<style lang ="scss" scoped>
.comform {
  margin-top: 20px;
}
.current {
  background-color: #fffbe5;
}
.el-select .el-select--medium {
  z-index: 10000;
}
.screening {
  margin-bottom: 20px;
}
</style>